require(['./config'],()=>{
   require(['template','request','header','footer'],(template,request,header)=>{
      class myCart{
         constructor(){
            this.init()
            this.tiaoZhuan()
           
         }
         init(){
            let cartList = localStorage.getItem('cart')
            console.log(cartList.length)
            if(cartList.length!=2){
               this.cartList = JSON.parse(cartList)
               $('#shopping_car').html(template('srcShop',{cartList:this.cartList}))
               //有数据就需要默认计算一次总价
               this.calcTotalMoney()
               //给所有的单选按钮绑定事件
               this.checksChange()
               this.addCount()
               this.decCount()
               this.delList()
            }else if(cartList.length==2){
               //购物车没有数据
               console.log(cartList.length)
               $('#cart-empty').show()
            }
         }
         //计算总价
         calcTotalMoney(){
            $('#Paymoney').html(this.cartList.reduce((money,cart)=>{
               if(cart.checked) money += cart.price * cart.num
               return money
            },0).toFixed(2))
         }
         checksChange(){
            const _this = this
            $('#all-check').prop('checked',_this.cartList.every(cart=>{
               return cart.checked
            }))
            //给所有的单选按钮绑定事件
            $('#shopping_car .shop_cont input:checkbox').on('change',function(){
               //取到当前商品的id
               let id = $(this).parents('tr').attr('data-id')
               // console.log(id)
               //根据id修改当前商品的选中状态
               _this.cartList = _this.cartList.map(cart=>{
                  if(cart.id == id) cart.checked=$(this).prop('checked')
                  return cart
               })
               //重新存localstorage
               localStorage.setItem('cart',JSON.stringify(_this.cartList))
               //全选按钮根据数据是否全选来渲染
               $('#all-check').prop('checked',_this.cartList.every(cart=>{
                  return cart.checked
               }))
               //计算总价
               _this.calcTotalMoney()
            })
            //点击全选按钮，单个按钮全部选中
            $('#all-check').on('change',function(){
               //当点击全选按钮时，改变localstorage里面单选按钮的checked值，并重新存，便于计算总价
               _this.cartList = _this.cartList.map(cart=>{
                   cart.checked =$(this).prop('checked')
                   return cart
                  // console.log(cart.checked)
               })
               localStorage.setItem('cart',JSON.stringify(_this.cartList))
               _this.calcTotalMoney()
               // console.log(_this.cartList)
               //改变单选框的是否选中的状态(有否有选中的小钩钩)
               $('#shopping_car .shop_cont input:checkbox').prop('checked',_this.cartList.every(cart=>{
                  return cart.checked
               }))
            })
         }
         addCount(){
            const _this=this
            $('tbody').on('click','.plus',function(){
               // console.log($(this))
               console.log(_this.cartList)
               let id = $(this).parents('tr').attr('data-id')
               _this.cartList = _this.cartList.map(cart=>{
                  if(cart.id == id) {
                     cart.num++;
                     $(this).prev().val(cart.num);
                     $(this).parents('tr').children('.submoney').html((cart.price*cart.num).toFixed(2))
                  }
                  return cart
               })
               localStorage.setItem('cart',JSON.stringify(_this.cartList))
               _this.calcTotalMoney()
               header.calcCartNum()
            }) 
         }
         decCount(){
            const _this=this
            $('tbody').on('click','.minus',function(){
               // console.log($(this))
               console.log(_this.cartList)
               let id = $(this).parents('tr').attr('data-id')
               _this.cartList = _this.cartList.map(cart=>{
                  if(cart.id == id) {
                     cart.num--;
                     $(this).next().val(cart.num);
                     $(this).parents('tr').children('.submoney').html((cart.price*cart.num).toFixed(2))
                  }
                  return cart
               })
               localStorage.setItem('cart',JSON.stringify(_this.cartList))
               _this.calcTotalMoney()
               header.calcCartNum()

            }) 
         }
         delList(){
            const _this=this
            $('.del-btn').on('click',function(){
               let id = $(this).parents('tr').attr('data-id')
               _this.cartList=_this.cartList.filter(cart=>{
                  return (cart.id !=id)
               })
               localStorage.setItem('cart',JSON.stringify(_this.cartList))
               $(this).parents('.del-btn-container').remove()
               console.log(_this.cartList.length)
               if(_this.cartList.length==0){
                  $('table').remove()
                  $('.empty').show()
               }
               $('#all-check').prop('checked',_this.cartList.every(cart=>{
                  return cart.checked
               }))
               _this.calcTotalMoney()
               header.calcCartNum()
            })
         }
         tiaoZhuan(){
            $('#indent').on('click',function(){
               let userInfo=$.cookie('userInfo')
               if(userInfo){
                  window.location.replace('/html/payfor.html')
               }else{
                  alert('您还没有登录呐，请先登录')
                  window.location.replace('/html/login.html')
               }
            })
         }
      }
      new myCart()
   })
})